<template>
    <div class="page">
      <div>
        <h1>简单K型图</h1>
        <el-table :data="bannerlist1" style="width: 100%,height: 100%" >
          <el-table-column prop="x" label="x轴" width="100">
            <!-- <span>{{ x[0]}}</span> -->
            </el-table-column>
          <el-table-column prop="val" label="y轴数据" width="100" />
        </el-table>
      </div>
    </div>
  </template>
      
      <script setup lang="ts">
  import { reactive, ref } from "vue";
  import service from "../../../utils/service";
  
  interface ibanner {
    x: string[]
    val:number[]
  }
  
  let bannerlist1 = reactive<ibanner[]>([]);
  
  const getbannerlist1 = () => {
    service({
      url: "/data/kData",
    }).then((res) => {
      if (res.data.code == "200") {
        bannerlist1.length = 0;
        bannerlist1.push(...res.data.data.x);
        console.log(res.data.data.x[1]);
        
        bannerlist1.push(...res.data.data.val);
        console.log(res.data.data.val[0][0]);

      }
    });
  };
  
  getbannerlist1();
  </script>
      
      <style scoped>
  .img {
    width: 100px;
    height: 100px;
  }
  .page {
    width: 100%;
    height: 1000px;
  }
  </style>